<template>
  <div>
    <BannarVue />
    <div class="box">
      <div class="item">
        <router-link active-class="active" to="/home">Home</router-link>
        <router-link active-class="active" to="/about">About</router-link>
      </div>
      <router-view />
    </div>
  </div>
</template>

<script>

import BannarVue from './components/Bannar.vue'


export default {

  name: 'App',
  components: {

    BannarVue
  }
}
</script>

<style lang="less" scoped>
.active{
  color: blue;
}
.box{
  display: flex;
  flex-direction: row;
  gap: 10px;
  .item{
    display: flex;
    flex-direction: column;
    gap: 10px
  }
}
</style>
